<template>
	<view class="container">
		<view class="img">
			<image v-if="info.img != 1" :src="info.img" class="tui-avatar"></image>
			<image v-else src="http://i1.fuimg.com/714355/9ee0c539cc1c57df.png" class="tui-avatar"></image>
		</view>
		<view class="tui-userinfo-box">
			<tui-list-cell padding="0" :hover="false">
				<view class="tui-list-cell">
					<view>用户名</view>
					<view class="tui-content">
						{{ info.user }}
					</view>
				</view>
			</tui-list-cell>
			<tui-list-cell padding="0" v-if="isBianJi">
				<view class="tui-list-cell" :hover="false">
					<view>手机号</view>
					<view class="tui-content">
						{{ info.userId }}
					</view>
				</view>
			</tui-list-cell>
			<tui-list-cell padding="0">
				<view class="tui-list-cell" :hover="false">
					<view>邀请码</view>
					<view class="tui-content">
						{{ info.invitationcode }}
					</view>
				</view>
			</tui-list-cell>
			<tui-list-cell padding="0">
				<view class="tui-list-cell" :hover="false">
					<view>脱恐宣言（或个人经历描述）</view>
					<view class="tui-content">
						{{ info.introduce }}
					</view>
				</view>
			</tui-list-cell>
			<tui-list-cell padding="0">
				<view class="tui-list-cell" :hover="false">
					<view>积分</view>
					<view class="tui-content">
						{{ info.integral }}
					</view>
				</view>
			</tui-list-cell>
		</view>
		<view class="flex-box">
			<view class="title">兴趣组</view>
			<view class="tui-tag tui-light-orange" v-for="(item, index) in info.yonghuBiaoQian" :key="index">{{ item.name }}</view>
		</view> 
		<button class="tui-btn" @click="$tools.uniApp.navigateTo('/pages/tim/room')" v-if="goRoom">和他聊天</button>
		<!-- <button class="tui-btn" @click="submit" v-if="isBianJi">编辑个人信息</button> -->
	</view>
</template>

<script>
	import tuiListCell from "@/components/tui/list-cell"
	export default {
		components: {
			tuiListCell
		},
		data() {
			return {
				info: uni.getStorageSync('userInfo'),
				isBianJi: true,
				goRoom : false
			}
		},
		onLoad(e) {
			// #ifndef H5
			uni.showShareMenu({
				showShareItems : ['qq', 'qzone', 'wechatFriends', 'wechatMoment']	
			});
			// #endif
			
			if( e.goRoom ){
				this.goRoom = e.goRoom;
			}
			
			if( e.userId ){
				this.isBianJi = false;
				this.getUserInfo(e.userId);
			}
			
		},
		methods: {
			async getUserInfo(id) {
				let data = {
					userId: id
				}
				let res = await this.$api.getUserInfoById(data);
				this.info = res.data;
			},
			async submit() {
				uni.navigateTo({
					url: 'edit'
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	@import '../../static/style/thorui.css';
	.container {
		padding-top: 100upx;
		//background: #fff;
	}

	.img {
		width: 200upx;
		height: 200upx;
		margin: 20upx auto;
		border-radius: 50%;
		//background: #fcd6d2;
	}

	.tui-btn {
		margin-left: 10%;
		width: 80%;
		background-color: #df5451;
		color: #fff;
	}

	.tui-userinfo-box {
		padding-bottom: 20rpx;
		color: #333;
	}

	.tui-list-cell {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 24rpx 60rpx 24rpx 30rpx;
		font-size: 30rpx;
		background: none !important;
	}

	.tui-pr30 {
		padding-right: 30rpx;
	}

	.tui-avatar {
		width: 100%;
		height: 100%;
		display: block;
		border-radius: 50%;
		image{
			border-radius: 50%;
		}
	}

	.tui-content {
		color: #666;
	}
	.flex-box{
		padding: 30upx;
		.title {
			padding: 30upx 0;
			font-size: 32upx;
			color: #333;
			font-weight: bold;
		}
		.tui-tag{
			margin: 10upx;
		}
	}
</style>
